import 'package:flutter/material.dart';
import 'package:getx_scaffold/getx_scaffold.dart';
import 'package:oramemo/common/styles/colors.dart';
import 'package:oramemo/generated/assets.dart';
import 'package:oramemo/pages/facility/blue/blue_logic.dart';
import 'package:oramemo/pages/facility/facility_router.dart';

class SettingVolview extends StatelessWidget {
  BlueLogic logic = Get.find();

  SettingVolview({super.key});

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        // 蓝牙状态
        Obx(() {
          final bool isBleConnected = logic.connectedDevice.value !=
              null;
          return Padding(
            padding: EdgeInsets.only(top:30.h,right: 16.0.w),
            child: _buildStatusItem(
              icon: IconX.image(
                  isBleConnected ? Assets.facilityBle : Assets
                      .facilityBleNot,
                  size: 18.r),
              text: isBleConnected ? '蓝牙已连接' : '蓝牙未连接',
            ),
          );
        }),
        Container(
          margin: EdgeInsets.symmetric(horizontal: 16.w, vertical: 12.h),
          padding: EdgeInsets.symmetric(horizontal: 12.w, vertical: 12.h),
          decoration: ShapeDecoration(
            color: const Color(0xFFF3F5F9),
            shape: RoundedRectangleBorder(
              side: const BorderSide(width: 1, color: Color(0x1992B9FF)),
              borderRadius: BorderRadius.circular(36.r),
            ),
          ),
          child: Obx(() {
            return Column(
              children: [
                SizedBox(height: 5.h),
                Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    // 左耳部分
                    _buildEarPanel(
                      title: '左耳电量',
                      label: 'L',
                      batteryValue: logic.connectedDevice.value != null
                          ? '${logic.leftEarBattery.value}'
                          : '- -',
                      onSubTap: () {
                        logic.leftEarVolume.value = logic.leftEarVolume.value >
                            0
                            ? logic.leftEarVolume.value--
                            : 0;
                        logic.setVolume(0x01, logic.leftEarVolume.value);
                      },
                      onAddTap: () {
                        logic.leftEarVolume.value = logic.leftEarVolume.value <
                            5
                            ? logic.leftEarVolume.value++
                            : 5;
                        logic.setVolume(0x01, logic.leftEarVolume.value);
                      },
                    ),

                    // 中间分隔线
                    Container(
                      height: 111.h,
                      margin: EdgeInsets.symmetric(horizontal: 5.w),
                      child: const VerticalDivider(
                        width: 1,
                        color: Color(0x1992B9FF),
                        thickness: 1,
                      ),
                    ),

                    // 右耳部分
                    _buildEarPanel(
                      title: '右耳电量',
                      label: 'R',
                      batteryValue: logic.connectedDevice.value != null
                          ? '${logic.rightEarBattery.value}'
                          : '- -',
                      onSubTap: () {
                        logic.rightEarVolume.value = logic.rightEarVolume
                            .value > 0
                            ? logic.rightEarVolume.value--
                            : 0;
                        logic.setVolume(0x01, logic.rightEarVolume.value);
                      },
                      onAddTap: () {
                        logic.rightEarVolume.value = logic.rightEarVolume
                            .value < 5
                            ? logic.rightEarVolume.value++
                            : 5;
                        logic.setVolume(0x01, logic.rightEarVolume.value);
                      },
                    ),
                  ],
                ),
              ],
            );
          }),
        ),
      ],
    );
  }

  Widget _buildStatusItem({
    required Widget icon,
    required String text,
  }) {
    return InkWell(
      onTap: () {
        Get.toNamed(FacilityRouter.deviceBlueConnect);
      },
      child: Row(
        mainAxisAlignment: MainAxisAlignment.end,
        children: [
          icon,
          Text(
            text,
            style: TextStyle(
              color: Colours.text,
              fontSize: 14.sp,
            ),
          ),
          SizedBox(width: 5.w),
        ],
      ),
    );
  }

  Widget _buildEarPanel({
    required String title,
    required String label,
    required String batteryValue,
    final GestureTapCallback? onSubTap,
    final GestureTapCallback? onAddTap,
  }) {
    return Expanded(
      child: Container(
        decoration: ShapeDecoration(
          color: Colors.white,
          shape: RoundedRectangleBorder(
            side: const BorderSide(width: 1, color: Color(0x1992B9FF)),
            borderRadius: BorderRadius.circular(24.r),
          ),
        ),
        child: Column(
          children: [
            SizedBox(height: 20.h),
            // 标题和标签
            Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                Text(
                  title,
                  textAlign: TextAlign.center,
                  style: TextStyle(
                    color: Color(0xFF06164B),
                    fontSize: 20.sp,
                    fontFamily: 'Inter',
                    fontWeight: FontWeight.w500,
                  ),
                ),
                SizedBox(width: 5.w),
                Container(
                  width: 20.w,
                  height: 20.h,
                  decoration: const ShapeDecoration(
                    color: Color(0xFF888992),
                    shape: OvalBorder(),
                  ),
                  child: Center(
                    child: Text(
                      label,
                      textAlign: TextAlign.center,
                      style: TextStyle(
                        color: Colors.white,
                        fontSize: 16.sp,
                        fontFamily: 'Inter',
                        fontWeight: FontWeight.w500,
                      ),
                    ),
                  ),
                ),
              ],
            ),


            // 电量显示
            Container(
              height: 68.h,
              child: Row(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  Text(
                    batteryValue,
                    textAlign: TextAlign.center,
                    style: TextStyle(
                      color: Colors.black,
                      fontSize: 20.sp,
                      fontFamily: 'Inter',
                      fontWeight: FontWeight.w700,
                    ),
                  ),
                  Text(
                    '%',
                    textAlign: TextAlign.center,
                    style: TextStyle(
                      color: Colors.black,
                      fontSize: 20.sp,
                      fontFamily: 'Inter',
                      fontWeight: FontWeight.w400,
                    ),
                  ),
                  SizedBox(width: 10.w),
                  Icon(Icons.battery_0_bar),
                ],
              ),
            ),

            SizedBox(height: 6.h),

            // 底部控制栏
            Container(
              width: 120.w,
              height: 32.h,
              decoration: ShapeDecoration(
                color: Color(0xFFEEEEEF),
                shape: RoundedRectangleBorder(
                  borderRadius: BorderRadius.circular(12.r),
                ),
              ),
              child: Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: [
                  InkWell(
                    onTap: onSubTap,
                    child: Padding(
                      padding: EdgeInsets.only(left: 13.w),
                      child: Container(
                        width: 20.w,
                        height: 16.h,
                        child: Icon(Icons.remove, size: 16.sp, color: Color(0xFF888992)),
                      ),
                    ),
                  ),
                  InkWell(
                    onTap: onAddTap,
                    child: Padding(
                      padding: EdgeInsets.only(right: 12.w),
                      child: Container(
                        width: 20.w,
                        height: 16.h,
                        child: Icon(Icons.add, size: 16.sp, color: Color(0xFF888992)),
                      ),
                    ),
                  ),
                ],
              ),
            ),
          ],
        ),
      ),
    );
  }
}
